<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
	</head>
	<body>
		<div id="app">
			<div id="demo1">
				<p v-for="value,index in hobby">
					<span v-text="index+1"></span>
					---
					<span v-text="value"></span>
				</p>
			</div>
			<hr />
			<div id="demo3">
				<table border="1px" width="90%">
					<tr align="center">
						<td>编号</td>
						<td>名称</td>
						<td>年龄</td>
					</tr>
					<tr align="center" v-for="user in userList">
						<td v-text="user.id"></td>
						<td v-text="user.name"></td>
						<td v-text="user.age"></td>
					</tr>
					
				</table>
			</div>
		</div>
		<script src="../js/vue.js"></script>
		<script>
			var app = new Vue({
				el: "#app",
				data: {
					hobby: ["敲代码","改bug","专研技术"],
					userList: [{id:100,name:"泰盛",age:60},
					{id:200,name:"早柚",age:10},
					{id:300,name:"肖工",age:18}]
				},
				methods: {
					
				}		
			})
		</script>
	</body>
</html>
